<template>
<div v-loading="loading">
	<el-row class="tableBtnTop">
		<div class="search" style="margin-left:0;">
			<el-input v-model.trim="searchKeywords" @keyup.enter.native="onSearch" placeholder="请输入内容">
				<i slot="prefix" class="el-input__icon el-icon-search"></i>
			</el-input>
		</div>
		<el-button class="f1" @click="$router.push('/increment/integralShopDetail/')">添加商品</el-button>
	</el-row>
	<el-table :data="goodsList" border style="margin-top:20px;">
		<el-table-column prop="product_name" label="商品名称" :show-overflow-tooltip="true"></el-table-column>
		<el-table-column prop="time_created" label="上架时间" :show-overflow-tooltip="true">
			<template slot-scope="scope">
				{{scope.row.time_created | dateFormat}}
			</template>
		</el-table-column>
		<el-table-column prop="count" label="库存" :show-overflow-tooltip="true"></el-table-column>
		<el-table-column prop="price" label="所需积分" :show-overflow-tooltip="true"></el-table-column>
		<el-table-column prop="ispublic" label="商品状态" :show-overflow-tooltip="true">
			<template slot-scope="scope">
				<el-switch @change="onStatusChange(scope.row)" :active-value="1" :inactive-value="0" v-model.number="scope.row.ispublic"></el-switch>
			</template>
		</el-table-column>
		<el-table-column prop="btn" label="操作" :show-overflow-tooltip="true">
			<template slot-scope="scope">
			<div class="tableBtn">
				<a href="javascript:;" class="blue" @click="updateGoods(scope.row)">编辑</a>
				<el-popconfirm title="真的要删除这条信息吗?" @onConfirm="delGoods(scope.row)">
					<a class="gray" slot="reference">删除</a>
				</el-popconfirm>
			</div>
			</template>
		</el-table-column>
	</el-table>
	<div class="paginationBlock">
		<el-pagination @current-change="changePage" layout="prev, pager, next, total" :total="count" :current-page="page" :page-size="pageSize" hide-on-single-page></el-pagination>
	</div>
</div>
</template>

<script>
import fetch from '@/api/axios';
import {sysToYuan} from '@/utils/transPrice';
import {tsToDateFormat} from '@/utils/tsToDateFormat';
import deepClone from '@/utils/deepClone';
export default {
	data() {
		return {
			handleShow:false,
			goodsList: [],

			searchKeywords: '',
			loading: false,
			page: 1,
			pageSize: 10,
			count: 0,
		};
	},
	filters: {
		transPrice(p){
			return sysToYuan(p, 2);
		},
		dateFormat(t){
			return tsToDateFormat(t, 'yyyy-MM-dd hh:mm');
		},
	},
	created(){
		this.getList();
	},
	methods: {
		onSearch(){
			this.page = 1;
			this.getList();
		},
		getList(){
			let _this = this;
			this.loading = true;
			fetch.get('/api/console/user/score/product',{
				page: _this.page,
				pro_name: _this.searchKeywords == '' ? undefined : _this.searchKeywords
			}).then((res)=>{
				let data = res.data;
				if(data.code == 0){
					_this.count = data.data.count;
					_this.pageSize = data.data.pagesize;
					_this.goodsList = [...data.data.result];
				}else{
					_this.$message.error(data.message);
				}
			}).catch((err)=>{
				_this.$message.error(err.message);
			}).finally(()=>{
				_this.loading = false;
			});
		},
		changePage(page){
			this.page = page;
			this.getList();
		},
		onStatusChange(item){
			let _this = this;
			fetch.put('/api/console/user/score/product', {
				product: {
					pro_id: item.pro_id,
					ispublic: item.ispublic
				}
			}).then(res=>{
				let data = res.data;
				if(data.code == 0){
					_this.$message.success('操作成功');
				}else{
					_this.$message.error(data.message);
					_this.goodsList.forEach((v, k)=>{
						if(v.pro_id == item.pro_id){
							v.ispublic = !item.ispublic;
						}
					});
				}
			}).catch(err=>{
				_this.$message.error('网络连接失败，请稍后重试');
				_this.goodsList.forEach((v, k)=>{
					if(v.pro_id == item.pro_id){
						v.ispublic = !item.ispublic;
						return;
					}
				});
			});
		},
		addGoods(){
			this.$router.push('/increment/integralShopDetail');
		},
		updateGoods(item){
			this.$router.push('/increment/integralShopDetail?id='+item.pro_id);
		},
		delGoods(item){
			let id = item.pro_id;
			let _this = this;
			this.loading = true;
			fetch.get('/api/console/user/score/product', {
				delete: true,
				pro_id: id
			}).then(res=>{
				let data = res.data;
				if(data.code == 0){
					_this.$message.success('删除成功');
					_this.getList();
				}else{
					_this.$message.error(data.message);
				}
			}).catch(err=>{
				_this.$message.error('网络连接失败，请稍后重试');
			}).finally(()=>{
				_this.loading = false;
			});
		},
	},
	mounted() {

	}
};
</script>
<style lang="scss" scoped>
.title {
  margin-bottom: 25px;
  font-size: 21px;
  margin-top: 65px;
}
.tableBtnTop{
	margin-top:20px;
}
</style>